﻿/**
 * Created by Administrator on 2017/8/3.
 */
define(['CustomerInfo','ContactList','VisitRecord','LookedHouseList','TradedList'],function (CustomerInfo,ContactList,VisitRecord,LookedHouseList,TradedList) {
    var CustomerDetail = {
        name: 'customer-detail',
        template: ''
        + '<div class="list-details" id="app"  v-show="showCustomerDetail" >'
        + ' <div class="message-box draggable">'
        + '     <div class="maskWrap">'
        + '         <customer-info ref="customerInfo" v-bind:customerId="customerId" v-bind:pool-type="poolType"></customer-info>'

        + '          <div class="rightInfo pr">'
        + '              <div class="rightInfo-tab">'
        + '                  <div class="close">'
        + '                      <a href="javascript:;" class="clickBig"></a>'
        + '                      <a href="javascript:;" class="clickMin"></a>'
        + '                      <a href="javascript:;" class="clickClose" v-on:click="closeDetail"></a>'
        + '                  </div>'
        + '                  <Tabs v-model="tabValue" :animated="false">'
        + '                      <Tab-pane label="销售回访记录" name="visit-record">'
        + '                         <visit-record v-bind:pool-type="poolType"></visit-record>'
        + '                      </Tab-pane>'
        + '                      <Tab-pane label="带看记录" name="looked-house-list">'
        + '                         <looked-house-list></looked-house-list>'
        + '                      </Tab-pane>'
        + '                      <Tab-pane label="成交记录" name="traded-list">'
        + '                         <traded-list></traded-list>'
        + '                      </Tab-pane>'
        + '                      <Tab-pane label="联系方式" name="name4">'
        + '                         <contact-list  v-bind:pool-type="poolType"></contact-list>'
        + '                      </Tab-pane>'
        + '                  </Tabs>'
        + '              </div>'
        + '          </div>'

        + '     </div >'
        + '     <div class="details-but">'
        + '         <div class="details-but-left"  v-on:click="previousCustomerDetail"></div>'
        + '         <a href="#" class="shuaxin" v-on:click="refreshCustomerDetail"></a>'
        + '         <div class="details-but-right"  v-on:click="nextCustomerDetail"></div>'
        + '     </div>'
        + ' </div>'
        + ' <div class="zhezhao" v-on:click="closeDetail"></div>'
        + '</div>',
        props: {
            poolType: String
        },
        data: function () {
            return {
                showCustomerDetail: false,
                customerId: "",
                tabValue: "visit-record",
                isFocus: false,
            }
        },
        components: {
            CustomerInfo: CustomerInfo,
            VisitRecord: VisitRecord,
            LookedHouseList: LookedHouseList,
            TradedList: TradedList,
            ContactList: ContactList,
        },
        mounted: function () {
            var thisDetail = this;
            //监听showCustomerDetail
            window.bus.$on("showCustomerDetail", function (data) {
                thisDetail.loadDetail(data.customerId);
                thisDetail.showCustomerDetail = true;
                thisDetail.isFocus = true;
            });
            //监听shiftCustomerToDeptSuccess
            window.bus.$on("shiftCustomerToDeptSuccess", function () {
                thisDetail.showCustomerDetail = false;
                thisDetail.isFocus = false;
            });
            //监听shiftCustomerToOtherStaffSuccess
            window.bus.$on("shiftCustomerToOtherStaffSuccess", function () {
                thisDetail.showCustomerDetail = false;
                thisDetail.isFocus = false;
            });
            //监听shiftCustomerToOtherDeptSuccess
            window.bus.$on("shiftCustomerToOtherDeptSuccess", function () {
                thisDetail.showCustomerDetail = false;
                thisDetail.isFocus = false;
            });
            //监听shiftCustomerToStaffSuccess
            window.bus.$on("shiftCustomerToStaffSuccess", function () {
                thisDetail.showCustomerDetail = false;
                thisDetail.isFocus = false;
            });
            //监听TradedOperation
            window.bus.$on("TradedOperation", function (Id) {
                thisDetail.tabValue = "visit-record";

                setTimeout(function () {
                    var sellVisit = thisDetail.$el.querySelector(".sellVisit");
                    var liEl = thisDetail.$el.querySelector("#_" + Id);
                    var c = $(liEl).offset().top - $(liEl.parentElement).offset().top;//- $(liEl.parentElement.parentElement).offset().top;
                    sellVisit.scrollTop = c < 0 ? 0 : c;
                }, 50);
            });
            //监听deleteFocus
            window.bus.$on("deleteFocus", function () {
                thisDetail.isFocus = false;
            });
            //监听addFocus
            window.bus.$on("addFocus", function () {
                thisDetail.isFocus = true;
            });
        },
        computed: {

        },
        methods: {
            loadDetail: function (Id) {
                this.customerId = Id;
                //触发getCustomerDetail
                window.bus.$emit("getCustomerDetail", Id);
            },
            closeDetail: function () {
                this.showCustomerDetail = false;
                this.isFocus = false;
                //触发search
                window.bus.$emit("search",false);
            },
            refreshCustomerDetail: function (){
                //触发getCustomerDetail
                window.bus.$emit("getCustomerDetail", this.customerId);
            },
            nextCustomerDetail: function () {
                //触发nextCustomerDetail
                window.bus.$emit("nextCustomerDetail", this.customerId);
            },
            previousCustomerDetail: function () {
                //触发previousCustomerDetail
                window.bus.$emit("previousCustomerDetail", this.customerId);
            },
            keyUp(e) {
                const key = e.keyCode;
                if (key === 38 || key === 37 ) {
                    this.previousCustomerDetail();
                } else if (key === 40 || key === 39 ) {
                    this.nextCustomerDetail();
                }
            }
        },
    };
    return CustomerDetail;
});
